// modal 的样式
import type { ModalProps } from 'antd';
import { Button, Modal } from 'antd';

type OpenModalPorps = ModalProps;

export function OpenModal({ children, onCancel, onOk, ...props }: OpenModalPorps) {
  return (
    <Modal
      title={'选择'}
      footer={
        <div
          style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: -4, marginTop: 20 }}
        >
          <Button
            onClick={(e) => {
              onCancel?.(e as React.MouseEvent<HTMLButtonElement, MouseEvent>);
            }}
            style={{ borderRadius: 20, width: 120 }}
          >
            取消
          </Button>
          <Button
            type="primary"
            onClick={(e) => {
              onOk?.(e as React.MouseEvent<HTMLButtonElement, MouseEvent>);
            }}
            style={{ borderRadius: 20, width: 120 }}
          >
            确定
          </Button>
        </div>
      }
      bodyStyle={{ height: 'calc(100vh - 400px)', padding: 0, minHeight: '550px' }}
      centered
      onCancel={onCancel}
      destroyOnClose
      {...props}
    >
      {children}
    </Modal>
  );
}
